<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" id="viewport" content="width=device-width, initial-scale=1">
    <meta name="format-detection" content="telephone=yes"/>
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <title>黄埔女性</title>
    <link rel="stylesheet" type="text/css" href="{{url('css/jinxuan.css')}}" />
    <link rel="stylesheet" href="{{url('css/swiper.min.css')}}">
    <script src="{{url('js/swiper.min.js')}}"></script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        .blue-slide {
            background: #4390EE;
        }
        .red-slide {
            background: #CA4040;
        }
        .orange-slide {
            background: #FF8604;
        }
        .swiper-slide {
            line-height: 200px;
            color: #fff;
            font-size: 36px;
            text-align: center;
            height: 200px;
        }
        .swiper-slide img{
            width: 100%;
            height: auto;
        }
    </style>
</head>
<body>
<div>
    <div class="swiper-container">
        <div class="swiper-wrapper">
            @if(count($banners) > 0)
                @foreach($banners as $banner)
                    <div class="swiper-slide"><img src="{{$banner->img_url}}" /></div>
                @endforeach
            @endif
        </div>
    </div>
    <div style="position: relative;">
        <ul class="case">
            @if(count($contents) > 0)
                @foreach($contents as $content)
            <li>
                @if($content->img_id != 0)<img src="{{$content->img_url}}" />@endif
                <a href="{{$content->link_url}}">
                    <div class="content">
                        <span class="title">{{$content->title}}</span>
                        <span class="desc">{{$content->desc}}</span>
                    </div>
                </a>
            </li>
            <div style="border-bottom:1px solid #e2e1e1;"></div>
                @endforeach
            @endif
        </ul>
    </div>
</div>
</body>
<script>
    var mySwiper = new Swiper('.swiper-container',{
        loop: true,
        autoplay: 3000,
    });
</script>
</html>